import React, { useState, useEffect } from 'react'
import {
    SettingOutlined,
    SnippetsOutlined,
    WalletOutlined,
    PropertySafetyOutlined,
    UsergroupAddOutlined
} from '@ant-design/icons'; import { Layout, Menu, Button } from 'antd'
const { Header } = Layout;

function UserMenu(props) {

    const scrollToAnchor = (anchorName) => {
        window.location.href = anchorName;
    }

    return (
        <Menu mode="vertical" defaultSelectedKeys={[props.current]}>
            <Menu.Item key="1" icon={<SettingOutlined />} onClick={() => scrollToAnchor('/dashboard')}>
                控制面板
            </Menu.Item>
            <Menu.Item key="2" icon={<SnippetsOutlined />} onClick={() => scrollToAnchor('/myOrder')}>
                我的订单
            </Menu.Item>
            <Menu.Item key="3" icon={<WalletOutlined />} onClick={() => scrollToAnchor('/wallet')}>
                钱包
            </Menu.Item>
            <Menu.Item key="4" icon={<PropertySafetyOutlined />} onClick={() => scrollToAnchor('/safe')}>
                安全中心
            </Menu.Item>
            <Menu.Item key="5" icon={<UsergroupAddOutlined />} onClick={() => scrollToAnchor('/invite')}>
                我的推广
            </Menu.Item>
        </Menu>
    )
}


export default UserMenu